<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="/zzlp/js/angular1.6.0.js"></script>
    <script src="/zzlp/js/angular-route.js"></script>
    <script src="/zzlp/js/main.js"></script>
    <script src="/zzlp/js/controller.js"></script>
    <script src="//cdn.bootcss.com/angular-websocket/2.0.1/angular-websocket.js"></script>
    <script src="../js/chatController.js"></script>
    <script src="../js/emoji.js"></script>

    <title>自在天原</title>
    <link rel="stylesheet" href="/zzlp/css/main.css" type="text/css"/>
    <script type="text/javascript">
        function chatset() {
            $("#chat").html("<img src=\"/zzlp/img/3.png\"  alt=\"聊天\"  />");

        }

        function zztyset() {
            $("#zzty").html("<img src=\"/zzlp/img/2.png\"  alt=\"zzty\"  />");

        }

        function momset() {
            $("#moments").html("<img src=\"/zzlp/img/1.png\"  alt=\"圈子\"  />");

        }

        function setset() {
            $("#setting").html("<img src=\"/zzlp/img/3.png\"  alt=\"设置\"  />");

        }

        $("document").ready(function () {
            $("#chat").click(function () {
                $("#chat").html("<img src=\"/zzlp/img/33.png\"  alt=\"聊天\"  />");
                zztyset();
                momset();
            })
            $("#zzty").click(function () {
                $("#zzty").html("<img src=\"/zzlp/img/22.png\"  alt=\"zzty\"  />");
                chatset();
                momset();
            })
            $("#setting").click(function () {
                chatset();
                zztyset();
                momset();
            })
            $("#moments").click(function () {
                $("#moments").html("<img src=\"/zzlp/img/11.png\"  alt=\"圈子\"  />");
                chatset();
                zztyset();
            })
            $("#selfpage").click(function () {
                chatset();
                zztyset();
                momset();
            })
        })

    </script>
    <style type="text/css">
        <!--
        #La1 {
            position: absolute;
            width: 640px;
            height: 30px;
            z-index: 1;
            left: 0px;
            top: 0px;
        }

        #La3 {
            position: absolute;
            width: 180px;
            height: 30px;
            z-index: 1;
            left: 70px;
            top: 20px;
        }

        .STYLE5 {
            color: #FFFFFF;
            font-size: x-large;
        }

        #La11 {
            position: absolute;
            width: 50px;
            height: 30px;
            z-index: 1;
        }

        #La12 {
            position: absolute;
            width: 50px;
            height: 30px;
            z-index: 2;
            left: 60px;
            top: 0px;
        }

        -->
        .float_div {
            position: absolute;
            width: 110px;
            height: 30px;
            float: right;
            z-index: 100;
            right: 70px; /*   定位到右上   */
            top: 20px;
        }

        .STYLE6 {
            position: absolute;
            left: 70px;
            bottom: 55px;
            width: 182px;
            height: 30px;
            color: #8DCB69;
        }

        .STYLE7 {
            color: #FFFFFF;
            font-family: "宋体";
            font-size: 10px;
        }

        .STYLE12 {
            font-size: 12px;
            font-family: "宋体";
        }

        .STYLE14 {
            color: #FFFFFF;
            font-size: 12px;
            font-family: "宋体";
        }


    </style>
</head>

<body background="/zzlp/img/bg.jpg"
      style=" background-repeat:no-repeat;background-size:100% 100%;background-attachment:fixed;" ng-app="app">


<div id="La1">

    <div class="STYLE5" id="La3">
        <center>
    <span class="STYLE12">软件训练营&nbsp;&nbsp;|&nbsp;&nbsp;自在猎聘&nbsp;&nbsp;|&nbsp;&nbsp;软件众包
	</span>
        </center>
    </div>
</div>

<div class="STYLE6 STYLE7">
    中文&nbsp;&nbsp;|&nbsp;&nbsp;繁体&nbsp;&nbsp;|&nbsp;&nbsp;英文
</div>
<div class="float_div">
    <!--<div class="STYLE14" id="La11">登录</div>
    <div class="STYLE14" id="La12">注册</div>-->
    <div class="STYLE14" id="La11" ng-controller="logoutController" ng-click="logout()"><button class="btn btn-danger">注销</button></div>
</div>
<div class="center-in-center">

    <!--总div-->
    <div id="Layer1">
        <!--一级div-->
        <div id="Layer2" >
            <div id="Layer14" ng-controller="mainAvaCtrl"><a href="#!selfpage" id="selfpage"> <img ng-src="{{mainAvatar}}" alt="selfpage"/></a></div>
            <div id="Layer15">
                <div id="Layer18">
                    <a href="#!chat" id="chat"> <img src="/zzlp/img/3.png" alt="聊天"/></a>
                </div>
            </div>
            <div id="Layer16">
                <div id="Layer19">
                    <a href="#!zzty" id="zzty"> <img src="/zzlp/img/2.png" alt="zzty"/></a>


                </div>
            </div>
            <div id="Layer21">
                <a href="#!setting" id="setting"> <img src="/zzlp/img/4.png" alt="设置"/></a>
            </div>
            <div id="Layer25">
                <div id="Layer26">
                    <a href="#!moments" id="moments"> <img src="/zzlp/img/1.png" alt="圈子"/></a>

                </div>
            </div>
        </div>
        <!--一级div结束-->


        <div ng-controller="chatController">


            <div id="Layer29">
                <!--二级div-->
                <div id="Layer27">

                </div>
                <!--二级div结束-->


                <!--三级div-->
                <!-- 聊天总框-->

                <div id="Layer28">

                </div>
                <!--三级div结束-->

            </div>


            <!--如路由则覆盖上方-->
            <div ng-view></div>
            <ul ng-repeat="data in MyData.collection">
                <li> {{ data }}</li>
            </ul>
        </div>

    </div>
</div>
</body>
</html>
